<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>客户列表</title>
</head>
<body>
<div th:fragment="customerList(status,iPageCurrent,pages,customerInfoList)" th:if="${status} eq 5" class="container" >


    <!-- begin::page-header -->
    <div class="page-header">
        <h4>客户信息</h4>
    </div>
    <!-- end::page-header -->


    <div  class="card">
    <div class="card-body " >

        <!--begin:: body-head        -->
        <div class="app-action row" style="margin-bottom: 15px">

            <!--  begin::新增客户信息 button-->
            <div class="action-left col-md-3">

                <button class="btn btn-outline-primary btn-block" data-toggle="modal" data-target="#addCustomer">
                    <i data-feather="plus" class="mr-2"></i>
                    新增客户
                </button>
            </div>
            <!--  end::新增客户信息 button-->

            <!-- begin::新增客户信息对应 弹窗  组件-->
            <div class="modal fade" id="addCustomer" tabindex="-1" role="dialog" aria-hidden="true">
                <div class="modal-dialog " role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title">创建新客户</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <i class="ti-close"></i>
                            </button>
                        </div>
                        <div class="modal-body">
                            <form autocomplete="off" class="form-group " action="/customerManage/addCustomer">
                                <div class=" row">
                                    <label class="col-sm-3 col-form-label" id="event-title">客户名称</label>
                                    <div class="col-sm-9">
                                        <input type="text" class="form-control" placeholder="客户名称" name="customername">
                                    </div>
                                </div>
                                <div class=" row">
                                    <!--                                                <span style="color:red">*</span>-->
                                    <label class="col-sm-3 col-form-label" style="color:red">真实姓名&nbsp*</label>
                                    <div class="col-sm-9">
                                        <input type="text" class="form-control" placeholder="真实姓名" name="realname"
                                               required="required">
                                    </div>
                                </div>
                                <div class="row">
                                    <label class="col-sm-3 col-form-label" style="color:red">电话&nbsp*</label>
                                    <div class="col-sm-9">
                                        <input type="text" class="form-control" placeholder="电话" name="phone"  required="required">
                                    </div>
                                </div>
                                <div class="row">
                                    <label class="col-sm-3 col-form-label">email</label>
                                    <div class="col-sm-9">
                                        <input type="text" class="form-control" placeholder="email" name="email">
                                    </div>
                                </div>
                                <div class="row">
                                    <label class="col-sm-3 col-form-label">公司</label>
                                    <div class="col-sm-9">
                                        <input type="text" class="form-control" placeholder="公司" name="company">
                                    </div>
                                </div>
                                <div class="row">
                                    <label class="col-sm-3 col-form-label">地址</label>
                                    <div class="col-sm-9">
                                        <input type="text" class="form-control" placeholder="地址" name="address">
                                    </div>
                                </div>
                                <div class="row">
                                    <label class="col-sm-3 col-form-label" style="color:red">级别&nbsp*</label>
                                    <div class="col-sm-9">
                                        <input type="text" class="form-control" placeholder="级别" name="level"  required="required">
                                    </div>
                                </div>
                                <div class="row">
                                    <label class="col-sm-3 col-form-label">途径</label>
                                    <div class="col-sm-9">
                                        <input type="text" class="form-control" placeholder="途径" name="channel">
                                    </div>
                                </div>
                                <div class="row">
                                    <label class="col-sm-3 col-form-label">标签ID</label>
                                    <div class="col-sm-9">
                                        <input type="text" class="form-control" placeholder="标签ID" name="tagsid">
                                    </div>
                                </div>
                                <div class="row">
                                    <label class="col-sm-3 col-form-label">标签</label>
                                    <div class="col-sm-9">
                                        <input type="text" class="form-control" placeholder="标签" name="remark">
                                    </div>
                                </div>
                                <div class="row">
                                    <label class="col-sm-3 col-form-label" style="color:red">客服ID&nbsp*</label>
                                    <div class="col-sm-9">
                                        <input type="text" class="form-control" placeholder="客服ID"
                                               name="customerserviceid"  required="required">
                                    </div>
                                </div>


                                <div class="form-group " align="center">
                                    <label class="col-sm-3"></label>
                                    <div class="col-sm-9">
                                        <button type="submit" id="btn-save" class="btn btn-primary">
                                            <i data-feather="send" class="mr-2"></i>
                                            确定
                                        </button>
                                    </div>

                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
            <!-- end::新增客户信息对应 弹窗组件 -->

            <!-- begin::Event Info Modal -->
            <div class="modal fade" id="viewEventModal" tabindex="-1" role="dialog" aria-hidden="true">
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title">
                                <span class="event-icon mr-2"></span>
                                <span class="event-title">Modal Title</span>
                            </h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <i class="ti-close"></i>
                            </button>
                        </div>
                        <div class="modal-body">
                            <div class="event-body"></div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- end::Event Info Modal -->


            <div class="action-right row col-md-8">
                <!--查询客户信息 搜索框-->
                <form class="col-md-8" method="post" action="/customerManage/customerTables">
                    <div class="input-group">
                        <input type="text" class="form-control" placeholder=" 请输入需要查找的客户名 " name="customername"
                               id="realname" aria-describedby="button-addon1">

                        <div class="input-group-append">
                            <button class="btn btn-outline-light" type="submit" id="button-addon1">
                                <i class="ti-search"></i>
                            </button>
                        </div>
                    </div>
                </form>
                <!--客户信息 分页组件-->
                <div class="app-pager d-flex align-items-center col-md-4">
                    <div class="mr-3 align-items-center row">
                        <div>1 &nbsp;&nbsp;</div>
                        <div>-&nbsp;&nbsp;</div>
                        <div th:text="${pages}"></div>
                        <div>&nbsp;&nbsp;of&nbsp;&nbsp;</div>
                        <div th:text="${iPageCurrent}"></div>
                    </div>
                    <nav aria-label="Page navigation example">
                        <ul class="pagination">
                            <li class="page-item">
                                <a class="page-link"
                                   th:href="@{/customerManage/customerTables(pageNum=(${iPageCurrent}-1))}"
                                   aria-label="Previous">
                                    <i data-feather="chevron-left" class="width-15 height-15"></i>
                                </a>
                            </li>
                            <li> &nbsp;&nbsp;&nbsp;&nbsp;</li>
                            <li class="page-item">
                                <a class="page-link"
                                   th:href="@{/customerManage/customerTables(pageNum=(${iPageCurrent}+1)%(${pages}+1))}"
                                   aria-label="Next">
                                    <i data-feather="chevron-right" class="width-15 height-15"></i>
                                </a>
                            </li>
                        </ul>

                    </nav>
                </div>
            </div>

        </div>
        <!--end:: body-head        -->


        <!--begin:: body-table        -->
        <table class="table table-striped table-bordered">
            <thead>
            <tr align="center">
                <th>序号</th>
                <th>ID</th>
                <th>客户名</th>
                <th>真实姓名</th>
                <th>电话</th>
                <th>邮箱</th>
                <th>客户等级</th>
                <th>客户来源</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            <div class="row">
                <div class="col-md-4">
                    <tr align="center" th:each="customer,rowInfo:${customerInfoList}">
                        <td>[[${rowInfo.count}]]</td>
                        <td>[[${customer.getId()}]]</td>
                        <td>[[${customer.getCustomername()}]]</td>
                        <td>[[${customer.getRealname()}]]</td>
                        <td>[[${customer.getPhone()}]]</td>
                        <td>[[${customer.getEmail()}]]</td>
                        <td>[[${customer.getLevel()}]]</td>
                        <td>[[${customer.getChannel()}]]</td>
                        <td>
                            <a th:href="@{/customerManage/individualCustomerInfo/(id=${customer.getId()})}">
                                <i class="ti-user mr-2"></i>
                            </a>
                            <a th:href="@{/customerManage/createWorkOrder/(id=${customer.getId()})}" data-toggle="modal" data-target="#workOrder">
                                <i class="ti-plus"></i></a>
                            <a th:href="@{/customerManage/deleteCustomer/(id=${customer.getId()})}" class="ml-2">
                                <i class="ti-trash mr-2"></i> </a>

                            <!-- begin::Create Event Modal 新建工单弹出框-->
                            <div class="modal fade" id="workOrder" tabindex="-1" role="dialog" aria-hidden="true">
                                <div class="modal-dialog" role="document">
                                    <div class="modal-content">
                                        <div class="modal-header" >
                                            <h5 class="modal-title">新建工单</h5>
                                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                <i class="ti-close"></i>
                                            </button>
                                        </div>

                                        <div class="modal-body">
                                            <form autocomplete="off" class="form-group" th:action="@{/customerManage/createWorkOrder/(id=${customer.getId()})}">
                                                <div class=" row">
                                                    <label class="col-sm-3 col-form-label" >创建人</label>
                                                    <div class="col-sm-9">
                                                        <input name="clist" class="form-control" type="text" th:value="${session.user.getRealname()}">
                                                    </div>
                                                </div>
                                                <div class=" row">
                                                    <label class="col-sm-3 col-form-label" >客户ID</label>
                                                    <div class="col-sm-9">
                                                        <input name="customerid" class="form-control" type="text" th:value="${customer.getId()}">
                                                    </div>
                                                </div>
                                                <div class=" row">
                                                    <label class="col-sm-3 col-form-label" >客服组号</label>
                                                    <div class="col-sm-9">
                                                        <input  type="text" class="form-control" name="customername" th:value="${session.gmid}" placeholder="请填写阿拉伯数字123..">
                                                    </div>
                                                </div>
                                                <div class=" row">
                                                    <!--                                                <span style="color:red">*</span>-->
                                                    <label class="col-sm-3 col-form-label" >客服编号</label>
                                                    <div class="col-sm-9">
                                                        <input name="customerserviceid" class="form-control" type="text" th:value="${session.user.getCustomerserviceid()}">
                                                    </div>
                                                </div>
                                                <div class="row">
                                                    <label class="col-sm-3 col-form-label" >分类</label>
                                                    <div class="col-sm-9">
                                                        <select name="worktype" type="text" class="form-control">
                                                            <option>分类一</option>
                                                            <option>分类二</option>
                                                            <option>分类三</option>
                                                            <option>分类四</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="row">
                                                    <label class="col-sm-3 col-form-label">标题</label>
                                                    <div class="col-sm-9">
                                                        <select name="title" type="text" class="form-control">
                                                            <option>客户报价</option>
                                                            <option>推广工单</option>
                                                            <option>最终数量</option>
                                                            <option>出厂订单</option>
                                                            <option>大批货物</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="row">
                                                    <label class="col-sm-3 col-form-label">优先级</label>
                                                    <div class="col-sm-9">
                                                        <select class="form-control" name="priority">
                                                            <option>低</option>
                                                            <option>中</option>
                                                            <option>高</option>
                                                            <option>紧急</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="row">
                                                    <label class="col-sm-3 col-form-label">渠道</label>
                                                    <div class="col-sm-9">
                                                        <select class="form-control" name="channel" type="text" id="validationCustom09" >
                                                            <option>网页录入</option>
                                                            <option>手动录入</option>
                                                        </select>                                        </div>
                                                </div>
                                                <div class="row">
                                                    <label class="col-sm-3 col-form-label" >状态</label>
                                                    <div class="col-sm-9">
                                                        <select class="form-control" id="state" name="state">
                                                            <option>未分配</option>
                                                            <option>待处理</option>
                                                            <option>处理中</option>
                                                            <option>已解决</option>
                                                        </select>
                                                    </div>
                                                </div>

                                                <div class="row">
                                                    <label class="col-sm-3 col-form-label">描述</label>
                                                    <div class="col-sm-9">
                                                        <input  type="text" class="form-control"  name="orderdesc" >
                                                    </div>
                                                </div>


                                                <div class="form-group " align="center">
                                                    <label class="col-sm-3"></label>
                                                    <div class="col-sm-9">
                                                        <button type="submit" class="btn btn-primary">
                                                            <i data-feather="send" class="mr-2"></i>
                                                            确定
                                                        </button>
                                                    </div>

                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- end::Create Event Modal -->

                        </td>


                    </tr>
                </div>
            </div>
        </table>
        <!--end:: body-table        -->

    </div>
</div>
</div>
</body>
</html>




